<template>
  <div>
   <div v-if="personNo=='' ">未选择员工</div>
   <div  v-if="personNo!=='' ">
 <el-button size="mini" @click="dialogFormVisibleadd=true" v-if="tableData.length==0" >添加简历</el-button>
<!--  添加 -->
     <el-dialog title="新增工作时间" :visible.sync="dialogFormVisibleadd" id="ind" :modal="false">
      <el-form :model="addform">
      <el-form-item label="工作时间从" :label-width="formLabelWidth">
          <div class="block">
       <el-date-picker
        v-model="addform.historyFrom"
        type="month"
        placeholder="选择月">
       </el-date-picker>
       </div>
        </el-form-item>
         <el-form-item label="工作时间至" :label-width="formLabelWidth">
          <div class="block">
       <el-date-picker
        v-model="addform.historyTo"
        type="month"
        placeholder="选择月">
       </el-date-picker>
       </div>
        </el-form-item>
        <el-form-item label="工作地点" :label-width="formLabelWidth">
          <el-input v-model="addform.workPlace" autocomplete="off"></el-input>
        </el-form-item>
      
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisibleadd = false">取 消</el-button>
        <el-button
          type="primary"
          @click="
            dialogFormVisibleadd = false;
            addjiashu()
          "
          >确 定</el-button
        >
      </div>
    </el-dialog>
<!-- 修改家属 -->
     <el-dialog title="修改工作信息" :visible.sync="dialogFormVisible" id="ind" :modal="false">
      <el-form :model="xiugaiform">
         <el-form-item label="工作时间从" :label-width="formLabelWidth">
          <div class="block">
       <el-date-picker
        v-model="xiugaiform.historyFrom"
        type="month"
        placeholder="选择月">
       </el-date-picker>
       </div>
        </el-form-item>
         <el-form-item label="工作时间至" :label-width="formLabelWidth">
          <div class="block">
       <el-date-picker
        v-model="xiugaiform.historyTo"
        type="month"
        placeholder="选择月">
       </el-date-picker>
       </div>
        </el-form-item>
        <el-form-item label="工作地点" :label-width="formLabelWidth">
          <el-input v-model="xiugaiform.workPlace" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button
          type="primary"
          @click="
            dialogFormVisible = false;
            xiugaijiashu()
          "
          >确 定</el-button
        >
      </div>
    </el-dialog>
<div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column align="center" label="工作时间从" >
        <template slot-scope="scope">
          <span>{{ scope.row.historyFrom }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="工作时间至">
        <template slot-scope="scope">
          <span>{{ scope.row.historyTo }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="工作地点">
        <template slot-scope="scope">
          <span>{{ scope.row.workPlace }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作">
        <template slot-scope="scope">
          <el-button size="mini" @click="dialogFormVisible=true;selectXq(scope.row)">修改</el-button>
          <el-button size="mini" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    </div>
    </div>
  </div>
</template>
<script>
import { mapActions } from 'vuex';
export default {
 created(){
   
 /* this.personNo=this.$route.query.id */
 if(this.$store.state.caozuoid){
    this.personNo=this.$store.state.caozuoid
    this.getpop()
    console.log(this.tableData.length)
 }else{
    this.personNo=''
 }
  },
  data() {
    return {
       pickerOptions: {
          disabledDate(time) {
            return time.getTime() > Date.now();
          },
          shortcuts: [{
            text: '今天',
            onClick(picker) {
              picker.$emit('pick', new Date());
            }
          }, {
            text: '昨天',
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit('pick', date);
            }
          }, {
            text: '一周前',
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', date);
            }
          }]
        },
        value1: '',
        value2: '',
      delform:{

      },
      addform:{
        historyFrom:'',
       historyTo:'',
      personNo:'',
      workPlace:'',
      },
      xiugaiform:{
         historyFrom:'',
       historyTo:'',
      personNo:'',
      workPlace:'',
      },
       personNo:'',
      form:[],
      formLabelWidth:'120px',
      dialogFormVisible:false,
      dialogFormVisibleadd:false,
      tableData: [],
      selectoption:'',
      options:[]
    };
  },
  methods: {
    ...mapActions(['tongyong']),
    onSubmit() {
      console.log('submit!');
    },
        
    /* 获取简历 */
    getpop(){
      this.tongyong({
        name: 'SELECT_jianli',
        data: {
          personNo:this.personNo
        },
      }).then(resp => {
        console.log(resp.data)
       this.tableData=resp.data.data
       for(let i=0 ;i<this.tableData.length;i++){
         this.tableData[i].historyFrom=this.tableData[i].historyFrom.slice(0,4)+'-'+this.tableData[i].historyFrom.slice(4,6)
         this.tableData[i].historyTo=this.tableData[i].historyTo.slice(0,4)+'-'+this.tableData[i].historyTo.slice(4,6)
         
       }
      });
    },
    selectXq(e){
      this.xiugaiform={...e}
      console.log(e)
    },
    /* 修改简历 */
    xiugaijiashu(){
     this.xiugaiform.historyFrom=this.getData(this.xiugaiform.historyFrom)
     this.xiugaiform.historyTo=this.getData(this.xiugaiform.historyTo)
     console.log(this.addform)
       this.tongyong({
        name: 'updata_jianli',
        data: 
          this.xiugaiform
        
      }).then(resp => {
        console.log(resp.data)
        if(resp.data.code==200){
          this.$message('修改成功')
          this.getpop()
        }else{
          this.$message('操作失败请重试')
        }
      }); 
    },
    /* 删除 */
     handleDelete(row){
          this.delform=row
 this.$confirm("此操作将永久删除, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.tongyong({
            name: "del_jianli",
            data: this.personNo,
          }).then((data) => {
            console.log(data.data.code)
          if(data.data.code==200){
          this.getpop()
          this.$message({
            type: "success",
            message: "删除成功!",
          });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
       },
       /* 修改时间格式 */
       getData(value) {
                let date = new Date(value)
                let year = date.getFullYear();
                let month = date.getMonth() + 1;
                console.log(month)
                if(month<10){
                  month=`${0}${month}`
                    console.log(month)
                }
                return `${year}${month}`
            },
            /* 添加简历 */
       addjiashu(){
        this.addform.historyFrom=this.getData(this.addform.historyFrom)
     this.addform.historyTo=this.getData(this.addform.historyTo)
          this.addform.personNo=this.personNo
          console.log(this.addform)
     this.tongyong({
        name: 'add_jianli',
        data: this.addform
        
      }).then(resp => {
          console.log(resp.data)
        if(resp.data.code==200){
          this.getpop()
          this.$message('添加成功')
        }else{
          this.$message('操作失败')
        }

      });
       }
  },
};
</script>
<style lang="less" scoped>
</style>
